import { FC } from 'react';
import { Popup, Button } from '@nutui/nutui-react-taro';
import { View } from '@tarojs/components';
import { Text } from '@tarojs/components';
import { showToast } from '@tarojs/taro';
import { openPrivacyContract } from '@tarojs/taro';
import { getPrivacySetting } from '@tarojs/taro';
import { onNeedPrivacyAuthorization } from '@tarojs/taro';
import { useMount } from 'react-use';
import { useSnapshot } from 'valtio';
import { useDidShow } from '@tarojs/taro';
import { eq } from 'lodash-es';
import state from './state';
import './index.scss';

let privacyHandler;
let privacyResolves = new Set();

onNeedPrivacyAuthorization(resolve => {
  if (typeof privacyHandler === 'function') {
    privacyHandler(resolve);
  }
});

const SysPrivacy: FC = () => {
  const snap = useSnapshot(state);

  useDidShow(() => handlePrivacySetting());

  useMount(() => privacyHandler = (resolve) => {
    privacyResolves.add(resolve);
    state.needAuthorization = 1;
  });

  const handlePrivacySetting = () => getPrivacySetting({
    success: ({ needAuthorization }) => (
      state.needAuthorization = (
        eq(needAuthorization, !0) ? 1 : 2)),
  });

  const handleOpenContract = () => (
    openPrivacyContract());

  const handleDisagree = async () => {
    await showToast({ title: '须同意后才能使用', icon: 'none' });
    privacyResolves?.forEach((resolve) => (
      resolve({ event: 'disagree', buttonId: 'disagree-btn' })));
    privacyResolves?.clear();
  };

  const handleAgree = () => {
    privacyResolves?.forEach((resolve) => (
      resolve({ event: 'agree', buttonId: 'agree-btn' })));
    privacyResolves?.clear();
    handlePrivacySetting();
  };

  return (<Popup
    visible={eq(snap.needAuthorization, 1)}
    overlayClassName='sys-privacy-overlay'
    className='sys-privacy'
    overlay={!0}
    position='bottom'
    closeOnOverlayClick={!1}
    closeable={!1}
    round={!0}
    zIndex={10000}>
    <View catchMove={!0}>
      <View className='hd'>
        <Text className='title'>隐私保护提示</Text>
      </View>
      <View className='bd'>
        <Text className='desc'>感谢您使用本小程序，我们非常重视您的个人信息安全和隐私保护。</Text>
        <Text className='desc'>根据最新法律要求，在使用我们的产品前，</Text>
        <Text className='desc'>您应当阅读并同意</Text>
        <Text className='link' onClick={handleOpenContract}>《用户隐私保护指引》</Text>
        <Text className='desc'>，</Text>
        <Text className='desc'>以便我们向您提供更优质的服务。</Text>
        <Text className='desc'>我们将尽全力保护您的个人信息及合法权益，感谢您的信任！</Text>
      </View>
      <View className='bd'>
        <Text className='desc'>当您点击同意时，即表示已理解并同意该条款内容，该条款将对您产生法律约束力；</Text>
        <Text className='desc'>如您拒绝，将无法继续使用小程序相关功能。</Text>
      </View>
      <View className='ft'>
        <Button
          id='disagree-btn'
          type='default'
          block={!0}
          onClick={handleDisagree}>
          拒绝
        </Button>
        <Button
          id='agree-btn'
          type='primary'
          block={!0}
          openType='agreePrivacyAuthorization'
          onAgreePrivacyAuthorization={handleAgree}>
          同意
        </Button>
      </View>
    </View>
  </Popup>);
};

export default SysPrivacy;
